<template>
  <Card style="width: 100%;" title="新增">
    <Form name="user" ref="form" :labelCol="labelCol" :wrapperCol="wrapperCol">
      <Row :type="flex">
        <Col :span="12" :offset="5">
          <FormItem name="resourceType" label="工具名称">
            <Input placeholder="请输入工具名称" style="width: 100%" />
          </FormItem>
        </Col>
      </Row>
      <Row>
        <Col :span="12" :offset="5">
          <FormItem name="resourceIps" label="版本号">
            <Input placeholder="请输入版本号" style="width: 100%" />
          </FormItem>
        </Col>
      </Row>
      <Row>
        <Col :span="12" :offset="5">
          <FormItem name="resourceIpw" label="工具介质">
            <Upload></Upload>
          </FormItem>
        </Col>
      </Row>
       <Row>
        <Col :span="12" :offset="5">
          <FormItem name="resourceIpw2" label="相关手册">
            <Upload></Upload>
          </FormItem>
        </Col>
      </Row>
      <Row>
        <Col :span="12" :offset="5">
          <FormItem name="resourceIp" label="适用平台">
             <Select
              type="multiple"
              style="width: 100%"
              allowClear
              :maxTag="4"
            >
              <Option value="1" label="标签1" disabled />
              <Option value="2" label="标签2njxsan那就看小说的我的" />
              <Option value="3" label="标签3" />
              <Option value="4" label="标签4" />
              <Option value="5" label="标签5" />
              <Option value="6" label="标签6" />
            </Select>
          </FormItem>
        </Col>
      </Row>
      <Row>
        <Col :span="24">
          <FormItem :wrapperCol="24" style="text-align: center">
            <Button type="primary" size="md" style="width: 100px;">提交</Button>
            <Button style="margin-left: 20px;width: 100px;" size="md">取消</Button>
          </FormItem>
        </Col>
      </Row>
    </Form>
  </Card>
</template>

<script>
import Upload from '@/components/upload/index'
export default {
  components: {
    Upload
  },
  data() {
    return {
      labelCol: {
        span: 8,
      },
      labelColW: {
        span: 4,
      },
      wrapperCol: {
        span: 12,
      },
       wrapperColW: {
        span: 18,
      },
      mockData: [],
      modelValue: ['chongqing', 'xiushan'],
        options: [
          {
            value: '金仓股份有限公司',
            label: '金仓股份有限公司',
            children: [
              {
                value: 'v1.0企业版',
                label: 'v1.0企业版',
              },
               {
                value: 'v2.0企业版',
                label: 'v2.0企业版',
              },
               {
                value: 'v3.0企业版',
                label: 'v3.0企业版',
              },
            ],
          },
          {
            value: '达梦股份有限公司',
            label: '达梦股份有限公司',
            children: [
              {
                value: 'v1.0企业版',
                label: 'v1.0企业版',
              },
               {
                value: 'v2.0企业版',
                label: 'v2.0企业版',
              },
               {
                value: 'v3.0企业版',
                label: 'v3.0企业版',
              },
            ],
          },
         {
            value: '瀚高基础软件',
            label: '瀚高基础软件',
            children: [
              {
                value: 'v1.0企业版',
                label: 'v1.0企业版',
              },
               {
                value: 'v2.0企业版',
                label: 'v2.0企业版',
              },
               {
                value: 'v3.0企业版',
                label: 'v3.0企业版',
              },
            ],
          },
        ],
    };
  },
  computed: {
    mockDataCom() {
      for (let i = 0; i < 10; i += 1) {
      const item = (name) => {
        return {
          key: `${name}-${i.toString()}`,
          title: `集团法务部${i}`,
        };
      };
      this.mockData.push(item('demo1'));
      return this.mockData
      }
    }
  },
  methods: {
    onSearch(value, e) {
      console.log("value", value, e);
    },
    updateModel(val) {
        console.log('change', val);
    },
  },
};
</script>


